/** @jsxImportSource @emotion/react */
import * as React from "react";
import {
  useTheme, CCell, Cell, Table, TableBody, TableRow, Text, RCell
} from "customize-easy-ui-component";
import { DirectLink } from "../../routing/Link";
import {eqpTypeAllMap} from "../../dict/eqpComm";
import {multilines2Html, zdBoth} from "../tools";


//不同版本能够直接复用的组件； 内容相对重复；减少代码数量的重复和冗余。
//注意<RouterLink to={`/report/`}>不能直接套在函数上面，其底下必须见到<>。
export const 检验设备情况= ( { orc,  repId, verId } : { orc: any,repId: string,verId: string}
) => {
  return <React.Fragment>
    <TableBody>
      <TableRow>
        <CCell component="th" scope="row" colSpan={2}>容器名称</CCell>
        <CCell>{orc.设备名称}</CCell>
        <CCell>检验类别</CCell>
        <CCell>定期检验</CCell>
      </TableRow>
      <TableRow>
        <CCell component="th" scope="row" colSpan={2}>容器类别</CCell>
        <CCell>{eqpTypeAllMap.get(orc.设备品种)}</CCell>
        <CCell>设备代码</CCell>
        <CCell>{orc.设备代码}</CCell>
      </TableRow>
      <TableRow>
        <CCell component="th" scope="row" colSpan={2}>单位内编号</CCell>
        <CCell>{orc.单位内部编号}</CCell>
        <CCell>使用登记证编号</CCell>
        <CCell>{orc.使用证号}</CCell>
      </TableRow>
      <TableRow >
        <CCell component="th" scope="row" colSpan={2}>制造单位</CCell>
        <CCell colSpan={3}>{orc.制造单位}</CCell>
      </TableRow>
      <TableRow >
        <CCell component="th" scope="row" colSpan={2}>安装单位</CCell>
        <CCell colSpan={3}>{orc.安装单位}</CCell>
      </TableRow>
      <TableRow >
        <CCell component="th" scope="row" colSpan={2}>使用单位</CCell>
        <CCell colSpan={3}>{orc.使用单位}</CCell>
      </TableRow>
      <TableRow >
        <CCell component="th" scope="row" colSpan={2}>使用单位地址</CCell>
        <CCell colSpan={3}>{orc.使用单位地址}</CCell>
      </TableRow>
      <TableRow >
        <CCell component="th" scope="row" colSpan={2}>设备使用地点</CCell>
        <CCell colSpan={3}>{orc.设备使用地点}</CCell>
      </TableRow>
      <TableRow>
        <CCell component="th" scope="row" colSpan={2}>使用单位统一社会信用代码</CCell>
        <CCell>{orc.使用单位信用码}</CCell>
        <CCell>邮政编码</CCell>
        <CCell>{orc.使用单位邮编}</CCell>
      </TableRow>
      <DirectLink  href={`/report/VS-DJ/ver/1/${repId}/Survey#Survey`}>
        <TableRow id={'Survey'}>
          <CCell component="th" scope="row" colSpan={2}>安全管理人员</CCell>
          <CCell>{orc.安全人员}</CCell>
          <CCell>联系电话</CCell>
          <CCell>{orc.联系电话}</CCell>
        </TableRow>
        <TableRow>
          <CCell component="th" scope="row" colSpan={2}>设计使用年限</CCell>
          <CCell>{orc.设计年限 || '／'} 年</CCell>
          <CCell>投入使用日期</CCell>
          <CCell>{orc.投用日期 || '／'}</CCell>
        </TableRow>
        <TableRow>
          <CCell component="th" scope="row" colSpan={2}>主体结构型式</CCell>
          <CCell>{orc.主体结构}</CCell>
          <CCell>运行状态</CCell>
          <CCell>{orc.运行状态}</CCell>
        </TableRow>
      </DirectLink>
      <DirectLink  href={`/report/VS-DJ/ver/1/${repId}/Performance`}>
        <TableRow>
          <CCell component="th" scope="row" rowSpan={4} >性能参数</CCell>
          <CCell>{orc.是换热? '换热面积':'容积'}</CCell>
          <CCell>{orc.容积换热} {orc.是换热? 'm²':'m³'}</CCell>
          <CCell>内径</CCell>
          <CCell>{orc.内径} mm</CCell>
        </TableRow>
        <TableRow>
          <CCell>设计压力</CCell>
          <CCell>{orc.设计压力} MPa</CCell>
          <CCell>设计温度</CCell>
          <CCell>{orc.许工作温} ℃</CCell>
        </TableRow>
        <TableRow>
          <CCell>使用压力</CCell>
          <CCell>{orc.使用压力} MPa</CCell>
          <CCell>使用温度</CCell>
          <CCell>{orc.使用温度} ℃</CCell>
        </TableRow>
        <TableRow>
          <CCell>工作介质</CCell>
          <CCell>{orc.工作介质}</CCell>
          <CCell colSpan={2}></CCell>
        </TableRow>
     </DirectLink>
    </TableBody>
  </React.Fragment>;
};

/**大部分不能编辑输入的：个字段数据来自后端准备好的数据
 * */
export const 资料审查设备= ( { orc,  repId, verId, rep } : { orc: any,repId: string,verId: string, rep: any}
) => {
  const theme = useTheme();
  return <>
    <TableBody>
      <TableRow>
        <CCell component="th" scope="row" colSpan={3}>设计单位</CCell>
        <CCell colSpan={4}>{orc.设计单位}</CCell>
      </TableRow>
      <TableRow>
        <CCell component="th" scope="row" colSpan={3}>产品标准</CCell>
        <CCell>{orc.产品标准}</CCell>
        <CCell colSpan={2}>设计日期</CCell>
        <CCell>{orc.设计日期}</CCell>
      </TableRow>
      <TableRow>
        <CCell component="th" scope="row" colSpan={3}>容器图号</CCell>
        <CCell>{orc.设计图号}</CCell>
        <CCell colSpan={2}>设计使用年限</CCell>
        <CCell><div css={{ display: 'flex',justifyContent: 'space-around',alignItems: 'center'}}>
          <Text >{orc.设计年限}</Text>
          <Text css={{ [theme.mediaQueries.lg+', print']: {wordBreak: 'keep-all'} }}>
                                   年</Text>
        </div></CCell>
      </TableRow>
      <TableRow >
        <CCell component="th" scope="row" colSpan={3}>制造单位</CCell>
        <CCell colSpan={4}>{orc.制造单位}</CCell>
      </TableRow>
      <TableRow >
        <CCell component="th" scope="row" colSpan={3}>制造日期</CCell>
        <CCell>{orc.制造日期}</CCell>
        <CCell colSpan={2}>产品编号</CCell>
        <CCell>{orc.出厂编号}</CCell>
      </TableRow>
      <TableRow >
        <CCell component="th" scope="row" colSpan={3}>安装单位</CCell>
        <CCell colSpan={4}>{orc.安装单位}</CCell>
      </TableRow>
      <DirectLink  href={`/report/VS-DJ/ver/1/${repId}/InformationReview`}>
        <TableRow >
          <CCell component="th" scope="row" colSpan={3}>投入使用日期</CCell>
          <CCell>{orc.投用日期}</CCell>
          <CCell colSpan={2}>上次检验日期</CCell>
          <CCell>{orc.上次定检日期}</CCell>
        </TableRow>
      </DirectLink>
      <TableRow >
        <CCell component="th" scope="row" colSpan={3}>设备代码</CCell>
        <CCell>{orc.设备代码}</CCell>
        <CCell colSpan={2}>使用登记证编号</CCell>
        <CCell>{orc.使用证号}</CCell>
      </TableRow>
      <TableRow>
        <CCell component="th" scope="row" rowSpan={2}>结构型式</CCell>
        <CCell colSpan={2}>主体结构型式</CCell>
        <CCell>{orc.主体结构}</CCell>
        <CCell colSpan={2}>安装型式</CCell>
        <CCell>{orc.安装型式}</CCell>
      </TableRow>
      <TableRow>
        <CCell colSpan={2}>支座型式</CCell>
        <CCell>{orc.支座型式}</CCell>
        <CCell colSpan={2}>保温绝热方式</CCell>
        <CCell>{orc.保温绝热方式}</CCell>
      </TableRow>
      <TableRow>
        <CCell component="th" scope="row" rowSpan={12}>性能参数</CCell>
        <CCell colSpan={2}>{orc.是换热? '换热面积':'容积'}</CCell>
        <CCell><div css={{ display: 'flex',justifyContent: 'space-around',alignItems: 'center'}}>
          <Text >{orc.容积换热}</Text>
          <Text css={{ [theme.mediaQueries.lg+', print']: {wordBreak: 'keep-all'} }}>
            {orc.是换热? 'm²':'m³'}</Text>
        </div></CCell>
        <CCell colSpan={2}>容器内径</CCell>
        <CCell><div css={{ display: 'flex',justifyContent: 'space-around',alignItems: 'center'}}>
          <Text >{orc.内径}</Text>
          <Text css={{ [theme.mediaQueries.lg+', print']: {wordBreak: 'keep-all'} }}>
                                   mm</Text>
        </div></CCell>
      </TableRow>
      <TableRow>
        <CCell colSpan={2}>高/长</CCell>
        <CCell><div css={{ display: 'flex',justifyContent: 'space-around',alignItems: 'center'}}>
          <Text >{orc.外形高长}</Text>
          <Text css={{ [theme.mediaQueries.lg+', print']: {wordBreak: 'keep-all'} }}>
                                   mm</Text>
        </div></CCell>
        <CCell colSpan={2}>最大允许充装量</CCell>
        <CCell><div css={{ display: 'flex',justifyContent: 'space-around',alignItems: 'center'}}>
          <Text >{orc.允许充装量}</Text>
          <Text css={{ [theme.mediaQueries.lg+', print']: {wordBreak: 'keep-all'} }}>
                                   Kg</Text>
        </div></CCell>
      </TableRow>
      <TableRow>
        <CCell rowSpan={2}>设计压力</CCell>
        <CCell>壳体（壳程）</CCell>
        <CCell><div css={{ display: 'flex',justifyContent: 'space-around',alignItems: 'center'}}>
          <Text >{orc.壳程设计压力}</Text>
          <Text css={{ [theme.mediaQueries.lg+', print']: {wordBreak: 'keep-all'} }}>
                                   MPa</Text>
        </div></CCell>
        <CCell rowSpan={2}>使用压力</CCell>
        <CCell>壳体（壳程）</CCell>
        <CCell><div css={{ display: 'flex',justifyContent: 'space-around',alignItems: 'center'}}>
          <Text >{orc.壳程使用压力}</Text>
          <Text css={{ [theme.mediaQueries.lg+', print']: {wordBreak: 'keep-all'} }}>
                                   MPa</Text>
        </div></CCell>
      </TableRow>
      <TableRow>
        <CCell>夹套（管程）</CCell>
        <CCell><div css={{ display: 'flex',justifyContent: 'space-around',alignItems: 'center'}}>
         <Text >{zdBoth(orc.夹套设计压力,orc.管程设计压力)??'/'}</Text>
          <Text css={{ [theme.mediaQueries.lg+', print']: {wordBreak: 'keep-all'} }}>
                                   MPa</Text>
        </div></CCell>
        <CCell>夹套（管程）</CCell>
        <CCell><div css={{ display: 'flex',justifyContent: 'space-around',alignItems: 'center'}}>
         <Text >{zdBoth(orc.夹套使用压力,orc.管程使用压力)??'/'}</Text>
          <Text css={{ [theme.mediaQueries.lg+', print']: {wordBreak: 'keep-all'} }}>
                                   MPa</Text>
        </div></CCell>
      </TableRow>
      <TableRow>
        <CCell rowSpan={2}>设计温度</CCell>
        <CCell>壳体（壳程）</CCell>
        <CCell><div css={{ display: 'flex',justifyContent: 'space-around',alignItems: 'center'}}>
         <Text >{orc.壳程设计温度}</Text>
          <Text css={{ [theme.mediaQueries.lg+', print']: {wordBreak: 'keep-all'} }}>
                                   ℃</Text>
        </div></CCell>
        <CCell rowSpan={2}>使用温度</CCell>
        <CCell>壳体（壳程）</CCell>
        <CCell><div css={{ display: 'flex',justifyContent: 'space-around',alignItems: 'center'}}>
         <Text >{orc.壳程使用温度}</Text>
          <Text css={{ [theme.mediaQueries.lg+', print']: {wordBreak: 'keep-all'} }}>
                                   ℃</Text>
        </div></CCell>
      </TableRow>
      <TableRow>
        <CCell>夹套（管程）</CCell>
        <CCell><div css={{ display: 'flex',justifyContent: 'space-around',alignItems: 'center'}}>
         <Text >{zdBoth(orc.夹套设计温度,orc.管程设计温度)??'/'}</Text>
          <Text css={{ [theme.mediaQueries.lg+', print']: {wordBreak: 'keep-all'} }}>
                                   ℃</Text>
        </div></CCell>
        <CCell>夹套（管程）</CCell>
        <CCell><div css={{ display: 'flex',justifyContent: 'space-around',alignItems: 'center'}}>
         <Text >{zdBoth(orc.夹套使用温度,orc.管程使用温度)??'/'}</Text>
          <Text css={{ [theme.mediaQueries.lg+', print']: {wordBreak: 'keep-all'} }}>
                                   ℃</Text>
        </div></CCell>
      </TableRow>
      <TableRow>
        <CCell rowSpan={2}>腐蚀裕度</CCell>
        <CCell>筒体</CCell>
        <CCell><div css={{ display: 'flex',justifyContent: 'space-around',alignItems: 'center'}}>
          <Text >{orc.筒体腐裕度}</Text>
          <Text css={{ [theme.mediaQueries.lg+', print']: {wordBreak: 'keep-all'} }}>
                                   mm</Text>
        </div></CCell>
        <CCell rowSpan={2}>介质</CCell>
        <CCell>壳体（壳程）</CCell>
        <CCell>{orc.壳程介质 || '／'}</CCell>
      </TableRow>
      <TableRow>
        <CCell>封头</CCell>
        <CCell><div css={{ display: 'flex',justifyContent: 'space-around',alignItems: 'center'}}>
          <Text >{orc.封头腐裕度}</Text>
          <Text css={{ [theme.mediaQueries.lg+', print']: {wordBreak: 'keep-all'} }}>
                                   mm</Text>
        </div></CCell>
        <CCell>夹套（管程）</CCell>
        <CCell>{zdBoth(orc.夹套介质,orc.管程介质)??'／'}</CCell>
      </TableRow>
      <TableRow>
        <CCell rowSpan={4}>材质</CCell>
        <CCell>筒体</CCell>
        <CCell>{orc.筒体材质 || '／'}</CCell>
        <CCell rowSpan={4}>厚度</CCell>
        <CCell>筒体</CCell>
        <CCell><div css={{ display: 'flex',justifyContent: 'space-around',alignItems: 'center'}}>
          <Text >{orc.筒体厚度}</Text>
          <Text css={{ [theme.mediaQueries.lg+', print']: {wordBreak: 'keep-all'} }}>
                                   mm</Text>
        </div></CCell>
      </TableRow>
      <TableRow>
        <CCell>封头</CCell>
        <CCell>{orc.封头材质 || '／'}</CCell>
        <CCell>封头</CCell>
        <CCell><div css={{ display: 'flex',justifyContent: 'space-around',alignItems: 'center'}}>
          <Text >{orc.封头厚度}</Text>
          <Text css={{ [theme.mediaQueries.lg+', print']: {wordBreak: 'keep-all'} }}>
                                   mm</Text>
        </div></CCell>
      </TableRow>
      <TableRow>
        <CCell>夹套（换热管）</CCell>
        <CCell>{orc.夹套材质 || '／'}</CCell>
        <CCell>夹套（换热管）</CCell>
        <CCell><div css={{ display: 'flex',justifyContent: 'space-around',alignItems: 'center'}}>
          <Text >{orc.夹套厚度}</Text>
          <Text css={{ [theme.mediaQueries.lg+', print']: {wordBreak: 'keep-all'} }}>
                                   mm</Text>
        </div></CCell>
      </TableRow>
      <TableRow>
        <CCell>衬里</CCell>
        <CCell>{orc.衬里材质 || '／'}</CCell>
        <CCell>衬里</CCell>
        <CCell><div css={{ display: 'flex',justifyContent: 'space-around',alignItems: 'center'}}>
          <Text >{orc.衬里厚度}</Text>
          <Text css={{ [theme.mediaQueries.lg+', print']: {wordBreak: 'keep-all'} }}>
                                   mm</Text>
        </div></CCell>
      </TableRow>
      <DirectLink  href={`/report/VS-DJ/ver/1/${repId}/InformationReview#InformationReview`}>
        <TableRow id={'InformationReview'}>
          <CCell component="th" scope="row" colSpan={2}>资料审查情况</CCell>
          <Cell colSpan={5}>{  multilines2Html(orc.资料审查情况,  (txt,i)=>{
            return <React.Fragment key={i}>{(i!==0)&&<br/>}<Text>{txt}</Text></React.Fragment>
          } ) }</Cell>
        </TableRow>
        <TableRow>
          <CCell component="th" scope="row" colSpan={2}>上次定期检验问题记载</CCell>
          <Cell colSpan={5}>上次定期检验安全状况等级评为 {orc.上次评级} ，报告号:{orc.上次定检报告号}，检验发现的缺陷及处理：
            <br/>{ multilines2Html(orc.上次缺陷处理,  (txt,i)=>{
              return <React.Fragment key={i}>{(i!==0)&&<br/>}<Text>{txt}</Text></React.Fragment>
            } ) }</Cell>
        </TableRow>
      </DirectLink>
    </TableBody>
  </>;
};

/**容器用的版本；
 * */
export const 首页设备概况nbh= ( {theme, orc } :{theme: any, orc:any}
) => {
  return  <Table fixed={ ["20%","%"] }   printColWidth={ ["143","572"] }   css={ {borderCollapse: 'collapse'} }  >
    <TableBody>
      <TableRow>
        <RCell css={{border:'none'}}>设备名称：</RCell>
        <CCell css={{border:'none',borderBottom:`1px dashed ${theme.colors.intent.primary.light}`}}>{orc.设备名称}</CCell>
      </TableRow>
      <TableRow>
        <RCell css={{border:'none'}}>设备代码：</RCell>
        <CCell css={{border:'none',borderBottom:`1px dashed ${theme.colors.intent.primary.light}`}}>{orc.设备代码}</CCell>
      </TableRow>
      <TableRow>
        <RCell css={{border:'none'}}>使用单位：</RCell>
        <CCell css={{border:'none',borderBottom:`1px dashed ${theme.colors.intent.primary.light}`}}>{orc.使用单位}</CCell>
      </TableRow>
      <TableRow>
        <RCell css={{border:'none'}}>单位内编号：</RCell>
        <CCell css={{border:'none',borderBottom:`1px dashed ${theme.colors.intent.primary.light}`}}>{orc.单位内部编号}</CCell>
      </TableRow>
      <TableRow>
        <RCell css={{border:'none'}}>检验类别：</RCell>
        <CCell css={{border:'none',borderBottom:`1px dashed ${theme.colors.intent.primary.light}`}}>定期检验</CCell>
      </TableRow>
      <TableRow>
        <RCell css={{border:'none'}}>检验日期：</RCell>
        <CCell css={{border:'none',borderBottom:`1px dashed ${theme.colors.intent.primary.light}`}}>{orc.检验日期}</CCell>
      </TableRow>
      <TableRow>
        <RCell css={{border:'none'}}>监察识别码：</RCell>
        <CCell css={{border:'none',borderBottom:`1px dashed ${theme.colors.intent.primary.light}`}}>{orc.监察识别码}</CCell>
      </TableRow>
    </TableBody>
  </Table>;
};

